<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" >
    <title>注册</title>
</head>
<body>
<div style="margin: 0 auto;width: 700px;">
    <div >
        <ul class="layui-nav">
            <li class="layui-nav-item" style="left:60px;">
                <a href="index.jsp"><img src="images/logo.jpg" height="50px" width="50px"></a>
            </li>
            <li class="layui-nav-item" style="float: right;right:60px;">
                <a href="register.jsp">注册<span class="layui-badge-dot"></span></a>
            </li>
            <li class="layui-nav-item" lay-unselect="" style="float: right;right:60px;">
                <a href="login.jsp">登录<span class="layui-badge-dot"></span></a>
            </li>
        </ul>
    </div>
    <div>
        <form class="layui-form" action="register.do" lay-filter="example" method="post" id="register_form">
            <div style="display: inline-block;">
                <div class="layui-form-item">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-block">
                        <input type="text" name="name" id="name" autocomplete="off" placeholder="请输入姓名" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">用戶名</label>
                    <div class="layui-input-block">
                        <input type="text" name="username" id="username" autocomplete="off" placeholder="请输入用戶名" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-block">
                        <input type="password" name="password" id="password" placeholder="请输入密码" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">性别</label>
                    <div class="layui-input-block" id="sex">
                        <input type="radio" name="sex"  value="男" title="男" checked="">
                        <input type="radio" name="sex"  value="女" title="女">
                    </div>
                </div>
            </div>

            <div style="display: inline-block;float: right;">
                <div class="layui-upload">
                    <button type="button" class="layui-btn" id="upimgs">上传图片</button>
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" id="upimg" height="90px" width="90px">
                        <!-- <p id="demoText">上傳</p> -->
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">地址</label>
                <div class="layui-input-block">
                    <input type="text" name="address" id="address" autocomplete="off" placeholder="请输入地址" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" id="discrib" class="layui-textarea" name="discrib"></textarea>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="button" id="register" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
                </div>
            </div>
            <input type="hidden" name="role_id" id="role_id" value="0">
        </form>
        <input type="hidden" id="MSG" value="${MSG}">
    </div>
</div>
</body>
<script src="layui/layui.js" charset="utf-8"></script>
<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;
    });
    layui.use('upload', function(){
        var $ = layui.jquery
            ,upload = layui.upload;//upimgs register.do upimg
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#upimgs'
            ,url: 'https://httpbin.org/post' //改成您自己的上传接口
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#upimg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code > 0){
                    return layer.msg('上传失败');
                }
                //上传成功
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
    });
</script>
<script src="js/jquery.js"></script>
<script>
    $("#register").click(function () {
        var username=$("#username").val();
        var password=$("#password").val();
        var name=$("#name").val();
        if(name==''||name==null||name==undefined){
            alert("请输入姓名！");
        }
        else if(username==''||username==null||username==undefined){
            alert("请输入用户名！");
        }
        else if(password==''||password==null||password==undefined){
            alert("请输入密码！");
        }
        else{
            $("#register_form").submit();
        }
    })
    if($("#MSG").val()!=''&&$("#MSG").val()!=null&&$("#MSG").val()!=undefined){
        alert($("#MSG").val());
        $("#MSG").val('');
    }
</script>
</html>

